/**
 * @param {locked} Boolean 遮罩层是否设置锁定态 "true" 点击遮罩层背景部分不会关闭弹窗 "false" 点击遮罩层背景部分关闭弹窗，默认为false
 * @param {show} Boolean 弹窗是否显示，默认为true
 * @param {top} String 弹窗整体距离页面顶部高度，默认为0
 * @param {type} String 弹窗类型：可选值为（'error'、'success'、 ''），为error或success时是操作提示弹窗，为''时是自定义弹窗
 * @param {title} String 当弹窗类型为（'error'、'success'）时，该值生效，为弹窗标题
 * @param {text} String 当弹窗类型为（'error'、'success'）时，该值生效，为弹窗内容
 */

Component({
  properties: {
    locked: {
      type: Boolean,
      value: false
    },
    show: {
      type: Boolean,
      value: false,
      observer: function (show) {
        this.util()
      }
    },
    type: {
      type: String,
      value: ''
    },
    title: {
      type: String,
      value: '提示'
    },
    text: {
      type: String,
      value: '操作成功ヽ(･ω･´ﾒ)'
    },
    top: {
      type: String,
      value: '0'
    }
  },
  data: {
    animationData: {},
    myShow: false
  },
  lifetimes: {
    created () {
      this._init()
    }
  },
  // observers: {
  //   'show': function (show) {
  //     this.util()
  //   }
  // },
  methods: {
    _init () {
      const animation = wx.createAnimation({
        duration: 300,  //动画时长
        timingFunction: 'linear', //线性
        delay: 0  //0则不延迟
      })
      this.animation = animation
    },
    maskTap () {
      const { locked, myShow } = this.data
      if (locked === false && myShow === true) {
        this.setData({
          myShow: false
        })
      }
    },
    confirm () {
      this.setData({
        myShow: false
      })
    },
    util () {
      let arr
      if (this.data.show) {
        arr = [0, 1]
        this.setData({ myShow: true })
      } else {
        arr = [1, 0]
        this.setData({ myShow: false })
      }
      this.animation.opacity(arr[0]).step()
      this.setData({
        animationData: this.animation.export()
      })
      setTimeout(() => {
        this.animation.opacity(arr[1]).step()
        this.setData({
          animationData: this.animation.export()
        })
      }, 300)
    }
  }
})